@import "../global-connect";

.ext-form {
  &-menu {
    @media (min-width: @screen-xl) and (max-width: @screen-xxl) {
      .ant-menu-item {
        padding: 0 8px !important;
        height: 32px !important;
        line-height: 32px;
        margin: 2px 0 4px 0 !important;
      }
    }

    img {
      width: 24px;
      height: 24px;
    }
  }

  &-comment {
    padding-left: 6px;
    padding-right: 3px;
  }
}

.ext-tool {
  .model {
    padding-top: 3px;

    span {
      font-weight: 900;
      margin-right: 6px;
    }
  }
}

.ext-list {
  margin-top: 6px;
  padding: 6px;
  border-radius: 8px;
  background-color: #ECECEC;

  background-image: linear-gradient(0deg, hsla(0, 0%, 100%, .3) 1px, transparent 0),
  linear-gradient(90deg, hsla(0, 0%, 100%, .3) 1px, transparent 0),
  linear-gradient(0deg, white 2px, transparent 0),
  linear-gradient(90deg, white 2px, transparent 0);
  background-size: 5px 5px, 5px 5px, 90px 90px, 90px 90px;

  .ant-list-pagination {
    width: 100%;
    float: left;
    margin-top: 0;
  }

  .item {
    width: 31%;
    margin: 1%;
    float: left;
    min-height: 300px;
    text-align: center;

    img {
      margin-left: 15%;
      width: 70%;
      height: 220px; // 解决界面闪烁的问题
    }

    img:hover {
      cursor: pointer;
    }

    .action {
      &-disabled {
        color: @color-card-disabled !important;

        &:hover {
          cursor: not-allowed;
        }
      }

      &-design {
        color: @color-card-design;
        font-size: 18px;
      }

      &-edit {
        color: @color-card-edit;
        font-size: 18px;
      }

      &-delete {
        color: @color-card-delete;
        font-size: 18px;
      }
    }

    .card {
      padding-top: 12px;
    }
  }
}